<template>
  <div>
	  <div class="demo-input-suffix">
		<el-button type="primary" icon="el-icon-search" @click='search()'>搜索</el-button>
	  	<el-input
	  	placeholder="请输入要查询的名字"
	  	prefix-icon="el-icon-search"
	  	v-model="input2" style="width: 25%;">
	  	</el-input>
		<a href= 'http://127.0.0.1:5000/authUser/export'><el-button type="success" style="float: right;margin-bottom: 10px;" round>导出</el-button></a>
	  </div>
    <template>
      <el-table
        :data="tableData5"
        style="width: 100%">
        <el-table-column
          prop="username"
          label="用户名"
        >
        </el-table-column>
        <el-table-column
          prop="realname"
          label="真实姓名"
		  width="90px"
         >
        </el-table-column>
        <el-table-column
          prop="email"
          label="邮箱"
		  width="170px"
        >
        </el-table-column>
        <el-table-column
          prop="academy"
          label="学院"
		  width="150px"
		>
        </el-table-column>
		<el-table-column
		  prop="class"
		  label="班级"
		>
		</el-table-column>
		<el-table-column
		  prop="gender"
		  label="性别"
		  width="50px"
		>
		</el-table-column>
		<el-table-column
		  prop="score"
		  label="分数"
		>
		</el-table-column>
		<el-table-column
		  prop="registerTime"
		  label="注册时间"
		  width="160px"
		>
		</el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)">取消认证</el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>
	  <div class="block" style="margin-top: 10px;" v-show="!searchFlag">
		<el-pagination
		  background
		  layout="prev, pager, next"
		  :page-size='6'
		  :total='total'
		@current-change="handleCurrentChange"
		:current-page="currentPage"
		 >
		</el-pagination>
	  </div>
  </div>
</template>

<script>
export default {
  name: 'filterTable',
  data () {
    return {
      tableData5: [{
		  uid: '1',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
		  
      },{
		  uid: '2',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
		  
      },{
		  uid: '3',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
		  
      },{
		  uid: '4',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
		  
      },{
		  uid: '5',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
      },{
		  uid: '6',
		  username: '咸鱼',
		  realname: '薛国鹏',
		  email: '2043928998@qq.com',
		  academy: '电子与信息工程学院',
		  class: '18网络',
		  gender: '男',
		  score: '100000',
		  registerTime: '2019-02-02 10:07:34'
      }],
	  input2:'',
	  total: 60,
	  currentPage: 1,
	  searchFlag: false
    }
  },
  created() {
	  // 首屏数据
	  this.axios.get(this.server + '/authUser/firstMsg?token=' + this.store.getters.token).then(res => {
		  if(res.data != '0') {
			  this.tableData5 = res.data.tableData;
			  this.total = res.data.total;
		  }
	  },res => {
		  this.$message.error("网络连接失败！")
	  })
  },
  methods: {
	search() {
		if(this.input2.trim() == "") {
			this.searchFlag = false
			// 发送请求，重新请求本页数据
			this.axios.get(this.server + '/authUser/unFirstMsg?page=' + this.currentPage + '&token=' + this.store.getters.token).then(res => {
			  if(res.data != '0') {
				  this.tableData5 = res.data.tableData;
			  }
			},res => {
				this.$message.error("网络连接失败！")
			})
		}else if(this.input2.trim().length < 2) {
			this.$message.error('您搜索的姓名不正确！')
		}else {
			//进行搜索
			this.axios.get(this.server + '/authUser/searchMsg?keyword=' + this.input2 + '&token=' + this.store.getters.token).then(res => {
			  if(res.data != '0') {
				  this.tableData5 = res.data.tableData;
			  }
			},res => {
				this.$message.error("网络连接失败！")
			})
			this.searchFlag = true;
		}
	},
    handleDelete (index, row) {
	  var uid = this.tableData5[index].uid; 
      this.$message.info("正在取消编号为"+ uid + "用户的认证，请稍等！")
	  this.axios.get(this.server + '/authUser/delAuth?uid=' + uid + '&token=' + this.store.getters.token).then(res => {
	    if(res.data == '1') {
	  	  this.$message.success("取消成功！")
		  this.axios.get(this.server + '/authUser/firstMsg?token=' + this.store.getters.token).then(res => {
			  if(res.data != '0') {
				  this.tableData5 = res.data.tableData;
				  this.total = res.data.total;
			  }
		  },res => {
			  this.$message.error("网络连接失败！")
		  })
	    }else {
			this.$message.error("取消失败！")
		}
	  },res => {
	  	this.$message.error("网络连接失败！")
	  })
    },
	handleCurrentChange(val) {
	    // console.log(`当前页: ${val}`);
		this.axios.get(this.server + '/authUser/unFirstMsg?page=' + val + '&token=' + this.store.getters.token).then(res => {
		  // console.log(`当前页: ${val}`);
		  // console.log(res.data)
		  if(res.data != '0') {
			  this.tableData5 = res.data.tableData;
			  this.currentPage = val;
		  }
		},res => {
			this.$message.error("网络连接失败！")
		})
	}
  }
}
</script>

<style scoped>

</style>
